<!DOCTYPE html>
<html>
<head>
  <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
  <script src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/js/lib/jquery-1.10.2_d88366fd.js"></script>
  <script type="text/javascript" src="canvas_album.js?v1.031301101"></script>

</head>
<body>

<div style="width: 100%;">
<!-- 注明当不支持canvas的浏览器 -->
<canvas id="canvas" width="296" height="518" style="">您的浏览器不支持canvas标签。</canvas>
<canvas id="canvas2" width="440" height="482" style="position: absolute;left: 270px;">您的浏览器不支持canvas标签。</canvas>
<canvas id="canvas3" width="350" height="380" style="position: absolute;top: 460px;left:10px;">您的浏览器不支持canvas标签。</canvas>
<canvas id="canvas4" width="480" height="356" style="position: absolute;top: 750px;left:10px;">您的浏览器不支持canvas标签。</canvas>
<canvas id="canvas5" width="378" height="604" style="position: absolute;top: 485px;left:312px;">您的浏览器不支持canvas标签。</canvas>
</div>
<div id="debug_info" style="position: absolute;top:0;left: 0;z-index: 9999;">Debug</div>
<script type="text/javascript">
  var canvas_album = new canvas_album();

  canvas_album.imgs = [
    {dom:"canvas",state:0,src:"2.jpg",width:296,height:518,scale:1,left:0,top:0,points:[
    [0,0],[250,0],[300,428],[0,520]
    ]},
    {dom:"canvas2",state:0,src:"2.jpg?ddd",width:440,height:482,scale:1,left:0,top:0,points:[
    [0,0],[438,0],[440,450],[52,482]
    ]},
    {dom:"canvas3",state:0,src:"1.jpg?dd6d",width:350,height:380,scale:2.1,left:150,top:10,points:[
    [0,80],[258,0],[354,278],[0,380]
    ]},
    {dom:"canvas4",state:0,src:"2.jpg?d1d6d",width:480,height:356,scale:1,left:0,top:0,points:[
    [0,104],[360,0],[480,356],[0,356]
    ]},
    {dom:"canvas5",state:0,src:"2.jpg?d1d",width:378,height:604,scale:1,left:0,top:0,points:[
    [0,30],[362,0],[378,604],[210,584]
    ]},
  ];
  canvas_album.deal_scale(window.innerWidth/721);
  canvas_album.edit = true;
  canvas_album.draw();

</script>
</body>
</html>

